<template>
	<view class="page">
		

		<view class="bg">
			
		
			<div class="dwo" style="z-index: 12;position: absolute;top:0px;">
			    <div class="shooting-stars">
			        <div class="shooting-star shooting-star-1"></div>
			        <div class="shooting-star shooting-star-2"></div>
			        <div class="shooting-star shooting-star-3"></div>
			        <div class="shooting-star shooting-star-4"></div>
			        <div class="shooting-star shooting-star-5"></div>
			    </div>
			  
			    <div class="sky">
			        <div class="stars-small"></div>
			        <div class="stars-medium"></div>
			        <div class="stars-large"></div>
			    </div>
			</div>
			
			<image class="bg_1" src="/static/bg_universe_top.png" mode="aspectFill"></image>
			<image class="bg_2" style="z-index: 13;" src="/static/bg_universe_starship.png" mode="aspectFill"></image>

			<view class="time-wrap">
				<view class="time-name">蚂蚁游飞船已航行</view>
				<view class="time-num">
				<!-- {{timeData.day}}天{{timeData.h}}:{{timeData.m}}:{{timeData.s}} -->
				<mryzr-timer  ref="timer" v-model="timeCount" :testButton="false" :auto="auto" format="day天HH:mm:ss" @callbackTimeCode="callbackTimeCode" ></mryzr-timer>
						     
				
				</view>
				<view class="time-sub">目的地 未来世界</view>
			</view>
			
			<transition name="fade">
			<view v-show="show" class="star-tips">
				{{man_num}}位居名已登陆飞船在浩瀚宇宙中寻找新世界
			</view>
			</transition>
		</view>

		<view class="list-wrap">
			<view class="list-title">航行中发现星球</view>

			<view class="list">
				<view class="item" @click="qd()">
					<image class="item-img" src="/static/my/fb5a63e87e670933b5ebd1ebaa33f71.png" mode="aspectFill"></image>
				</view>
				<view class="item"  @click="qd()">
					<image class="item-img" src="/static/my/3eed3cc1ff3f1d2a46f2b83dca28a1c.png" mode="aspectFill"></image>
				</view>
			<!-- 	<view class="item">
					<image class="item-img" src="/static/cosmo3.png" mode="aspectFill"></image>
				</view>
				<view class="item">
					<image class="item-img" src="/static/cosmo4.png" mode="aspectFill"></image>
				</view> -->
			</view>
		</view>

		<view class="tips-wrap">
			<image src="/static/cosmo_icon.png" mode="aspectFill" class="cosmo_icon"></image>
			<view class="">更多星球等待你探索发现</view>
		</view>
		
		<tabbar  v-if="lang==0" :current="2"></tabbar>
		<tabbareng v-if="lang==1" :current="1"></tabbareng>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				auto: false,
				timeCount: 86400,
				timeData: {
					day: '',
					h: '',
					m: '',
					s: ''
				},
				timer: null,
				show: false,
				timerShow: null,
				man_num:0,
				lang:1
			};
		},
		
		onLoad() {
			this.getTime();
			this.intervalTime();
			this.intervalShow();
		},
		onShow() {
			let lang = uni.getStorageSync('lang')
			
			if(lang){
				this.lang = lang;
			}else{
				this.lang = 0
			}
			
			let that = this;
			this.$api.request('/api/index/getchuan',{}, '', function(res){
	
				that.timeCount = res.data.time
				that.man_num = res.data.man_num
				that.start();
			});
		},
		onUnload() {
			if (this.timer) {
				clearInterval(this.timer);
				this.timer = null;
			}
			
			if(this.timerShow) {
				clearInterval(this.timerShow);
				this.timerShow = null;
			}
		},
		methods: {
			callbackTimeCode(){
				
			},
			qd(){
				uni.showToast({
					title: "敬请期待!",
					icon: 'none'
				})
			},
			 reset(){
				//重置计时器
				this.$refs.timer.reset()
			},
			start(){
				//开启计时器
				this.$refs.timer.start()
			},
			clear(){
				//停止计时器
				this.$refs.timer.clear()
			},
			getTime(){
				//监听计时器的秒数
				let timeCount = this.$refs.timer.getTimeCount();
				console.log(timeCount);
			},
			intervalTime() {
				this.timer = setInterval(() => {
					this.getTime();
				}, 500);
			},

			getTime() {
				let date = new Date();
				let start = new Date('2022/08/19');
				let y= date.getFullYear();
				let month = date.getMonth()+1;
				let d = date.getDate();
				let str = `${y}/${month<10?'0'+month: month}/${d<10?'0'+d: d}`;
				let end = new Date(str);
				let day = Math.ceil((end-start)/86400000); 
				let h = date.getHours();
				let m = date.getMinutes();
				let s = date.getSeconds();
				this.timeData = {
					day,
					h: h < 10 ? '0' + h : h,
					m: m < 10 ? '0' + m : m,
					s: s < 10 ? '0' + s : s
				};
			},
			
			// 显示隐藏
			intervalShow() {
				this.timerShow = setInterval(() => {
					this.show = !this.show;
				},700);
			}
		}
	};
</script>

<style lang="less">
	.fade-enter-active, .fade-leave-active {
		transition: opacity 1s ease;
	}
	.fade-enter, .fade-leave-to {
		opacity: 0;
	}
	.page {
		background: rgba(0, 0, 0, 0.97);
		min-height: 100vh;
	}

	.bg {
		position: relative;
		padding-top: 300rpx;
		width: 100%;


		.bg_1 {
			width: 100%;
			height: 760rpx;
			position: absolute;
			top: 0;
			left: 0;
			z-index: 9;
		}

		.bg_2 {
			width: 100%;
			height: 760rpx;
			position: relative;
			z-index: 9;
		}

		.time-wrap {
			position: absolute;
			left: 0;
			right: 0;
			top: 100rpx;
			color: #655e83;
			z-index: 999;
			width: 100%;
			display: flex;
			justify-content: center;
			align-items: center;
			flex-direction: column;
		}

		.time-name {
			font-size: 30rpx;
		}

		.time-num {
			font-size: 60rpx;
			font-weight: bold;
		}

		.time-sub {
			font-size: 28rpx;
		}
		
		.star-tips {
			position: absolute;
			left: 120rpx;
			top: 795rpx;
			color: rgba(255, 255, 255, 0.5);
			z-index: 99;
			width: 350rpx;
			font-size: 26rpx;
		}
	}

	.list-wrap {
		position: relative;
		color: rgba(255, 255, 255, 0.4);

		.list-title {
			display: flex;
			justify-content: center;
			font-size: 36rpx;
			font-weight: bold;
			padding: 0 32rpx;
		}

		.list {
			display: flex;
			align-items: center;
			flex-wrap: wrap;
			padding: 32rpx 0;

			.item {
				width: 90%;
				margin-left:5%;
				margin-top:30rpx;
				display: flex;
				justify-content: center;
				align-items: center;
			}

			.item-img {
				width:100%;
				height: 194rpx;
			}
		}
	}

	.tips-wrap {
		display: flex;
		justify-content: center;
		align-items: center;
		color: rgba(255, 255, 255, 0.3);
		font-size: 24rpx;
		padding: 64rpx 32rpx;

		.cosmo_icon {
			width: 48rpx;
			height: 35rpx;
			margin-right: 16rpx;
			transform: rotate(20deg);
		}
	}
	
	
	
	
	
	
* {
    box-sizing: border-box;
}

html,
body {
    background-color: #f1f1f1;
}

.dwo {
    position: relative;
    width: 500px;
    height: 300px;
    margin: 0 auto;
    overflow: hidden;
}

.sky {
    width: 1000px;
    height: 1000px;
    border-radius: 50%;
    position: relative;
    top: -50%;
    left: -50%;
    animation: sky-timelapse 300s infinite linear;
}


.stars-small {
    width: 1px;
    height: 1px;
    background: transparent;
    box-shadow: 397px 260px #fff, 704px 747px #fff, 600px 451px #fff, 561px 593px #fff,
        126px 41px #fff, 399px 955px #fff, 466px 843px #fff, 28px 493px #fff, 319px 147px #fff,
        7px 14px #fff, 201px 616px #fff, 581px 917px #fff, 691px 663px #fff, 197px 920px #fff,
        969px 486px #fff, 270px 522px #fff, 85px 695px #fff, 892px 248px #fff, 830px 330px #fff,
        20px 183px #fff, 388px 466px #fff, 977px 782px #fff, 682px 564px #fff, 122px 46px #fff,
        151px 885px #fff, 548px 482px #fff, 431px 677px #fff, 699px 421px #fff, 321px 155px #fff,
        562px 328px #fff, 487px 74px #fff, 36px 68px #fff, 344px 640px #fff, 317px 285px #fff,
        385px 917px #fff, 666px 409px #fff, 940px 875px #fff, 170px 528px #fff, 69px 463px #fff,
        760px 862px #fff, 659px 271px #fff, 775px 346px #fff, 741px 664px #fff, 425px 689px #fff,
        854px 301px #fff, 646px 210px #fff, 865px 958px #fff, 963px 301px #fff, 568px 635px #fff,
        771px 256px #fff, 166px 532px #fff, 850px 174px #fff, 273px 643px #fff, 267px 570px #fff,
        408px 270px #fff, 671px 159px #fff, 146px 148px #fff, 158px 45px #fff, 402px 188px #fff,
        878px 884px #fff, 660px 152px #fff, 365px 807px #fff, 671px 506px #fff, 303px 950px #fff,
        319px 791px #fff, 674px 583px #fff, 838px 266px #fff, 473px 199px #fff, 209px 162px #fff,
        176px 273px #fff, 767px 600px #fff, 724px 154px #fff, 12px 175px #fff, 136px 5px #fff,
        226px 328px #fff, 710px 429px #fff, 722px 246px #fff, 791px 15px #fff, 388px 118px #fff,
        754px 182px #fff, 451px 663px #fff, 936px 639px #fff, 370px 175px #fff, 363px 521px #fff,
        35px 270px #fff, 182px 256px #fff, 762px 943px #fff, 642px 634px #fff, 412px 629px #fff,
        358px 111px #fff, 288px 50px #fff, 781px 639px #fff, 634px 700px #fff, 824px 707px #fff,
        103px 976px #fff, 30px 41px #fff, 531px 590px #fff, 588px 727px #fff, 334px 504px #fff,
        492px 349px #fff, 651px 351px #fff, 260px 570px #fff, 340px 81px #fff, 195px 886px #fff,
        726px 746px #fff, 236px 897px #fff, 13px 508px #fff, 989px 442px #fff, 990px 378px #fff,
        465px 893px #fff, 781px 573px #fff, 715px 511px #fff, 528px 940px #fff, 869px 963px #fff,
        997px 930px #fff, 654px 980px #fff, 547px 720px #fff, 794px 732px #fff, 391px 419px #fff,
        429px 164px #fff, 404px 386px #fff, 695px 343px #fff, 281px 755px #fff, 978px 879px #fff,
        547px 957px #fff, 842px 938px #fff, 493px 500px #fff, 29px 808px #fff, 514px 980px #fff,
        43px 475px #fff, 994px 871px #fff, 437px 109px #fff, 777px 571px #fff, 325px 217px #fff,
        528px 864px #fff, 646px 353px #fff, 993px 374px #fff, 155px 488px #fff, 551px 287px #fff,
        760px 419px #fff, 876px 332px #fff, 317px 229px #fff, 733px 22px #fff, 337px 993px #fff,
        52px 997px #fff, 37px 639px #fff, 832px 409px #fff, 889px 37px #fff, 942px 620px #fff,
        396px 297px #fff, 468px 352px #fff, 715px 526px #fff, 133px 973px #fff, 142px 412px #fff,
        915px 254px #fff, 902px 793px #fff, 156px 971px #fff, 986px 278px #fff, 209px 214px #fff,
        548px 209px #fff, 257px 870px #fff, 681px 98px #fff, 144px 330px #fff, 417px 503px #fff,
        609px 448px #fff, 139px 121px #fff, 220px 618px #fff, 840px 738px #fff, 1000px 925px #fff,
        940px 627px #fff, 264px 176px #fff, 598px 362px #fff, 702px 923px #fff, 880px 873px #fff,
        653px 534px #fff, 886px 108px #fff, 574px 34px #fff, 645px 79px #fff, 476px 481px #fff,
        381px 467px #fff, 166px 72px #fff, 797px 337px #fff, 285px 38px #fff, 408px 737px #fff,
        575px 688px #fff, 230px 540px #fff, 158px 402px #fff, 573px 575px #fff, 344px 11px #fff,
        84px 54px #fff, 612px 562px #fff, 174px 692px #fff, 666px 922px #fff, 969px 684px #fff,
        494px 914px #fff, 902px 280px #fff, 636px 730px #fff, 166px 496px #fff, 795px 305px #fff,
        509px 504px #fff, 423px 692px #fff, 836px 437px #fff, 990px 226px #fff, 816px 895px #fff,
        248px 647px #fff, 561px 25px #fff, 432px 199px #fff, 456px 460px #fff, 122px 801px #fff,
        869px 506px #fff, 771px 300px #fff, 914px 580px #fff, 488px 731px #fff, 39px 766px #fff,
        236px 364px #fff, 439px 560px #fff, 133px 444px #fff, 734px 299px #fff, 887px 378px #fff,
        395px 357px #fff, 104px 423px #fff, 532px 948px #fff, 276px 763px #fff, 946px 623px #fff,
        524px 636px #fff, 479px 909px #fff, 99px 399px #fff, 424px 268px #fff, 135px 152px #fff,
        168px 275px #fff, 990px 709px #fff, 227px 644px #fff, 312px 743px #fff, 209px 239px #fff,
        721px 215px #fff, 727px 479px #fff, 340px 905px #fff, 931px 389px #fff, 750px 427px #fff,
        349px 254px #fff, 255px 104px #fff, 150px 578px #fff, 513px 85px #fff, 231px 83px #fff,
        547px 251px #fff, 526px 998px #fff, 198px 24px #fff, 883px 2px #fff, 206px 47px #fff,
        399px 604px #fff, 988px 236px #fff, 618px 533px #fff, 235px 874px #fff, 869px 185px #fff,
        264px 317px #fff, 676px 152px #fff, 61px 137px #fff, 494px 524px #fff, 16px 794px #fff,
        74px 138px #fff, 963px 678px #fff, 520px 348px #fff, 282px 211px #fff, 92px 76px #fff,
        828px 328px #fff, 776px 5px #fff, 220px 389px #fff, 965px 823px #fff, 965px 423px #fff,
        918px 298px #fff, 189px 900px #fff, 373px 356px #fff, 817px 26px #fff, 536px 663px #fff,
        90px 648px #fff, 403px 707px #fff, 26px 83px #fff, 933px 540px #fff, 855px 225px #fff,
        914px 701px #fff, 291px 506px #fff, 622px 364px #fff, 722px 988px #fff, 90px 940px #fff,
        21px 549px #fff, 769px 54px #fff, 953px 601px #fff, 540px 947px #fff, 15px 976px #fff,
        950px 630px #fff, 219px 656px #fff, 376px 395px #fff, 727px 29px #fff, 401px 326px #fff,
        996px 850px #fff, 130px 849px #fff, 102px 794px #fff, 400px 960px #fff, 234px 372px #fff,
        3px 125px #fff, 729px 223px #fff, 418px 234px #fff, 444px 914px #fff, 629px 431px #fff,
        222px 250px #fff, 877px 11px #fff, 968px 25px #fff, 883px 410px #fff, 480px 683px #fff,
        337px 599px #fff, 378px 242px #fff, 588px 544px #fff, 901px 571px #fff, 822px 549px #fff,
        866px 178px #fff, 893px 951px #fff, 58px 525px #fff, 154px 417px #fff, 458px 389px #fff,
        123px 17px #fff, 245px 347px #fff, 336px 357px #fff, 859px 303px #fff, 27px 4px #fff,
        51px 275px #fff, 881px 228px #fff, 182px 367px #fff, 791px 721px #fff, 565px 239px #fff,
        226px 946px #fff, 20px 397px #fff, 91px 200px #fff, 915px 979px #fff, 463px 290px #fff,
        156px 399px #fff, 922px 496px #fff, 444px 567px #fff, 749px 685px #fff, 423px 218px #fff,
        905px 968px #fff, 950px 901px #fff, 902px 27px #fff, 559px 898px #fff, 623px 507px #fff,
        314px 702px #fff, 750px 307px #fff, 396px 320px #fff, 260px 386px #fff, 849px 328px #fff,
        591px 581px #fff, 918px 877px #fff, 428px 843px #fff, 742px 18px #fff, 804px 677px #fff,
        42px 312px #fff, 458px 7px #fff, 160px 537px #fff, 208px 372px #fff, 76px 919px #fff,
        33px 105px #fff, 352px 117px #fff, 806px 75px #fff, 641px 687px #fff, 545px 918px #fff,
        498px 569px #fff, 90px 739px #fff, 153px 925px #fff, 437px 145px #fff, 872px 240px #fff,
        119px 248px #fff, 726px 543px #fff, 733px 637px #fff, 46px 612px #fff, 6px 482px #fff,
        517px 481px #fff, 131px 262px #fff, 173px 801px #fff, 137px 565px #fff, 288px 972px #fff,
        363px 831px #fff, 399px 249px #fff, 453px 823px #fff, 638px 293px #fff, 425px 399px #fff,
        856px 836px #fff, 820px 716px #fff, 542px 584px #fff, 598px 935px #fff, 497px 698px #fff,
        123px 420px #fff, 699px 220px #fff, 4px 983px #fff, 480px 404px #fff, 563px 363px #fff,
        665px 106px #fff, 855px 911px #fff, 65px 703px #fff, 721px 666px #fff, 429px 881px #fff,
        484px 578px #fff, 464px 153px #fff, 393px 259px #fff, 282px 987px #fff, 201px 882px #fff,
        375px 481px #fff, 671px 489px #fff, 328px 302px #fff, 838px 725px #fff, 39px 979px #fff,
        740px 884px #fff, 58px 160px #fff, 590px 936px #fff, 685px 561px #fff, 591px 72px #fff,
        672px 896px #fff, 906px 567px #fff, 288px 305px #fff, 383px 310px #fff, 548px 832px #fff,
        23px 921px #fff, 858px 959px #fff, 837px 192px #fff, 825px 103px #fff, 874px 306px #fff,
        794px 909px #fff, 878px 841px #fff, 275px 548px #fff, 189px 730px #fff, 407px 389px #fff,
        761px 746px #fff, 454px 166px #fff, 515px 370px #fff, 520px 507px #fff, 657px 505px #fff,
        81px 815px #fff, 854px 814px #fff, 510px 497px #fff, 943px 845px #fff, 600px 542px #fff,
        241px 993px #fff, 391px 561px #fff, 873px 736px #fff, 454px 918px #fff, 569px 303px #fff,
        903px 755px #fff, 336px 884px #fff, 356px 524px #fff, 740px 276px #fff, 299px 59px #fff,
        87px 446px #fff, 291px 496px #fff, 110px 163px #fff, 258px 759px #fff, 594px 606px #fff,
        926px 259px #fff, 13px 92px #fff, 446px 177px #fff, 610px 227px #fff, 296px 536px #fff,
        465px 992px #fff, 328px 707px #fff, 567px 207px #fff, 73px 584px #fff, 182px 106px #fff,
        915px 271px #fff, 445px 370px #fff, 676px 6px #fff, 177px 895px #fff, 785px 631px #fff,
        391px 729px #fff, 670px 51px #fff, 521px 382px #fff, 140px 11px #fff, 168px 598px #fff,
        461px 215px #fff, 607px 155px #fff, 542px 755px #fff, 974px 794px #fff, 877px 994px #fff,
        969px 626px #fff, 930px 485px #fff, 474px 719px #fff, 126px 105px #fff, 219px 275px #fff,
        256px 727px #fff, 96px 919px #fff, 884px 459px #fff, 317px 390px #fff, 411px 74px #fff,
        670px 323px #fff, 340px 442px #fff, 377px 893px #fff, 779px 679px #fff, 12px 923px #fff,
        230px 850px #fff, 332px 327px #fff, 183px 81px #fff, 99px 750px #fff, 301px 194px #fff,
        778px 236px #fff, 712px 799px #fff, 242px 541px #fff, 308px 719px #fff, 993px 403px #fff,
        233px 647px #fff, 317px 690px #fff, 518px 368px #fff, 134px 944px #fff, 573px 510px #fff,
        893px 484px #fff, 481px 609px #fff, 916px 454px #fff, 125px 170px #fff, 125px 29px #fff,
        286px 411px #fff, 99px 831px #fff, 648px 175px #fff, 80px 678px #fff, 3px 638px #fff,
        215px 196px #fff, 757px 807px #fff, 290px 935px #fff, 86px 962px #fff, 185px 117px #fff,
        577px 313px #fff, 478px 617px #fff, 613px 386px #fff, 561px 604px #fff, 859px 57px #fff,
        636px 156px #fff, 914px 644px #fff, 495px 755px #fff, 646px 431px #fff, 65px 37px #fff,
        907px 645px #fff, 117px 633px #fff, 273px 78px #fff, 318px 890px #fff, 244px 820px #fff,
        586px 51px #fff, 919px 994px #fff, 775px 974px #fff, 666px 574px #fff, 977px 864px #fff,
        156px 203px #fff, 199px 7px #fff, 399px 884px #fff, 109px 346px #fff, 980px 633px #fff,
        29px 411px #fff, 885px 158px #fff, 479px 211px #fff, 688px 44px #fff, 130px 40px #fff,
        446px 249px #fff, 17px 143px #fff, 742px 436px #fff, 850px 709px #fff, 565px 410px #fff,
        378px 126px #fff, 309px 750px #fff, 899px 910px #fff, 485px 459px #fff, 975px 842px #fff,
        582px 896px #fff, 310px 916px #fff, 337px 537px #fff, 14px 818px #fff, 340px 226px #fff,
        740px 196px #fff, 89px 771px #fff, 701px 673px #fff, 710px 544px #fff, 62px 462px #fff,
        242px 263px #fff, 436px 54px #fff, 27px 583px #fff, 413px 25px #fff, 951px 795px #fff,
        735px 288px #fff, 766px 824px #fff, 395px 625px #fff, 969px 388px #fff, 303px 984px #fff,
        430px 829px #fff, 861px 828px #fff, 736px 575px #fff, 858px 585px #fff, 946px 758px #fff,
        503px 496px #fff, 573px 719px #fff, 456px 291px #fff, 794px 251px #fff, 533px 320px #fff,
        333px 978px #fff, 378px 306px #fff, 974px 695px #fff, 1000px 208px #fff, 456px 819px #fff,
        28px 104px #fff, 643px 23px #fff, 494px 475px #fff, 791px 790px #fff, 899px 786px #fff,
        6px 908px #fff, 549px 501px #fff, 455px 467px #fff, 401px 877px #fff, 2px 152px #fff,
        768px 971px #fff, 253px 929px #fff, 671px 119px #fff, 965px 139px #fff, 46px 965px #fff,
        441px 2px #fff, 476px 121px #fff, 210px 362px #fff, 552px 476px #fff, 521px 921px #fff,
        782px 502px #fff, 53px 454px #fff, 36px 552px #fff, 830px 790px #fff, 393px 74px #fff,
        234px 28px #fff, 298px 344px #fff, 267px 185px #fff, 672px 295px #fff, 106px 770px #fff,
        59px 897px #fff, 674px 920px #fff, 735px 823px #fff, 827px 367px #fff, 594px 307px #fff,
        847px 302px #fff, 832px 572px #fff, 972px 572px #fff, 826px 488px #fff, 744px 347px #fff,
        480px 820px #fff, 783px 781px #fff, 363px 309px #fff, 772px 967px #fff, 226px 934px #fff,
        563px 921px #fff, 612px 954px #fff, 259px 394px #fff, 751px 574px #fff, 137px 729px #fff,
        811px 858px #fff, 390px 498px #fff, 986px 765px #fff, 488px 508px #fff, 535px 592px #fff,
        777px 203px #fff, 72px 200px #fff, 782px 686px #fff, 338px 946px #fff, 795px 549px #fff,
        133px 655px #fff, 747px 279px #fff, 538px 446px #fff, 111px 912px #fff, 98px 134px #fff,
        191px 836px #fff, 307px 490px #fff, 690px 257px #fff, 965px 145px #fff, 448px 425px #fff,
        199px 264px #fff, 287px 265px #fff, 233px 563px #fff, 25px 178px #fff, 871px 970px #fff,
        330px 552px #fff, 550px 452px #fff, 305px 812px #fff, 282px 95px #fff, 89px 574px #fff,
        292px 993px #fff, 581px 462px #fff, 786px 579px #fff, 295px 546px #fff, 706px 740px #fff,
        139px 216px #fff, 856px 871px #fff, 611px 290px #fff, 555px 931px #fff, 461px 759px #fff,
        985px 463px #fff, 257px 970px #fff, 98px 674px #fff, 254px 334px #fff, 201px 620px #fff,
        312px 777px #fff, 245px 226px #fff, 44px 364px #fff, 425px 948px #fff, 218px 64px #fff,
        455px 210px #fff;
}
.stars-small::after {
    content: ' ';
    position: absolute;
    top: 100px;
    width: 1px;
    height: 1px;
    background: transparent;
    box-shadow: 397px 260px #fff, 704px 747px #fff, 600px 451px #fff, 561px 593px #fff,
        126px 41px #fff, 399px 955px #fff, 466px 843px #fff, 28px 493px #fff, 319px 147px #fff,
        7px 14px #fff, 201px 616px #fff, 581px 917px #fff, 691px 663px #fff, 197px 920px #fff,
        969px 486px #fff, 270px 522px #fff, 85px 695px #fff, 892px 248px #fff, 830px 330px #fff,
        20px 183px #fff, 388px 466px #fff, 977px 782px #fff, 682px 564px #fff, 122px 46px #fff,
        151px 885px #fff, 548px 482px #fff, 431px 677px #fff, 699px 421px #fff, 321px 155px #fff,
        562px 328px #fff, 487px 74px #fff, 36px 68px #fff, 344px 640px #fff, 317px 285px #fff,
        385px 917px #fff, 666px 409px #fff, 940px 875px #fff, 170px 528px #fff, 69px 463px #fff,
        760px 862px #fff, 659px 271px #fff, 775px 346px #fff, 741px 664px #fff, 425px 689px #fff,
        854px 301px #fff, 646px 210px #fff, 865px 958px #fff, 963px 301px #fff, 568px 635px #fff,
        771px 256px #fff, 166px 532px #fff, 850px 174px #fff, 273px 643px #fff, 267px 570px #fff,
        408px 270px #fff, 671px 159px #fff, 146px 148px #fff, 158px 45px #fff, 402px 188px #fff,
        878px 884px #fff, 660px 152px #fff, 365px 807px #fff, 671px 506px #fff, 303px 950px #fff,
        319px 791px #fff, 674px 583px #fff, 838px 266px #fff, 473px 199px #fff, 209px 162px #fff,
        176px 273px #fff, 767px 600px #fff, 724px 154px #fff, 12px 175px #fff, 136px 5px #fff,
        226px 328px #fff, 710px 429px #fff, 722px 246px #fff, 791px 15px #fff, 388px 118px #fff,
        754px 182px #fff, 451px 663px #fff, 936px 639px #fff, 370px 175px #fff, 363px 521px #fff,
        35px 270px #fff, 182px 256px #fff, 762px 943px #fff, 642px 634px #fff, 412px 629px #fff,
        358px 111px #fff, 288px 50px #fff, 781px 639px #fff, 634px 700px #fff, 824px 707px #fff,
        103px 976px #fff, 30px 41px #fff, 531px 590px #fff, 588px 727px #fff, 334px 504px #fff,
        492px 349px #fff, 651px 351px #fff, 260px 570px #fff, 340px 81px #fff, 195px 886px #fff,
        726px 746px #fff, 236px 897px #fff, 13px 508px #fff, 989px 442px #fff, 990px 378px #fff,
        465px 893px #fff, 781px 573px #fff, 715px 511px #fff, 528px 940px #fff, 869px 963px #fff,
        997px 930px #fff, 654px 980px #fff, 547px 720px #fff, 794px 732px #fff, 391px 419px #fff,
        429px 164px #fff, 404px 386px #fff, 695px 343px #fff, 281px 755px #fff, 978px 879px #fff,
        547px 957px #fff, 842px 938px #fff, 493px 500px #fff, 29px 808px #fff, 514px 980px #fff,
        43px 475px #fff, 994px 871px #fff, 437px 109px #fff, 777px 571px #fff, 325px 217px #fff,
        528px 864px #fff, 646px 353px #fff, 993px 374px #fff, 155px 488px #fff, 551px 287px #fff,
        760px 419px #fff, 876px 332px #fff, 317px 229px #fff, 733px 22px #fff, 337px 993px #fff,
        52px 997px #fff, 37px 639px #fff, 832px 409px #fff, 889px 37px #fff, 942px 620px #fff,
        396px 297px #fff, 468px 352px #fff, 715px 526px #fff, 133px 973px #fff, 142px 412px #fff,
        915px 254px #fff, 902px 793px #fff, 156px 971px #fff, 986px 278px #fff, 209px 214px #fff,
        548px 209px #fff, 257px 870px #fff, 681px 98px #fff, 144px 330px #fff, 417px 503px #fff,
        609px 448px #fff, 139px 121px #fff, 220px 618px #fff, 840px 738px #fff, 1000px 925px #fff,
        940px 627px #fff, 264px 176px #fff, 598px 362px #fff, 702px 923px #fff, 880px 873px #fff,
        653px 534px #fff, 886px 108px #fff, 574px 34px #fff, 645px 79px #fff, 476px 481px #fff,
        381px 467px #fff, 166px 72px #fff, 797px 337px #fff, 285px 38px #fff, 408px 737px #fff,
        575px 688px #fff, 230px 540px #fff, 158px 402px #fff, 573px 575px #fff, 344px 11px #fff,
        84px 54px #fff, 612px 562px #fff, 174px 692px #fff, 666px 922px #fff, 969px 684px #fff,
        494px 914px #fff, 902px 280px #fff, 636px 730px #fff, 166px 496px #fff, 795px 305px #fff,
        509px 504px #fff, 423px 692px #fff, 836px 437px #fff, 990px 226px #fff, 816px 895px #fff,
        248px 647px #fff, 561px 25px #fff, 432px 199px #fff, 456px 460px #fff, 122px 801px #fff,
        869px 506px #fff, 771px 300px #fff, 914px 580px #fff, 488px 731px #fff, 39px 766px #fff,
        236px 364px #fff, 439px 560px #fff, 133px 444px #fff, 734px 299px #fff, 887px 378px #fff,
        395px 357px #fff, 104px 423px #fff, 532px 948px #fff, 276px 763px #fff, 946px 623px #fff,
        524px 636px #fff, 479px 909px #fff, 99px 399px #fff, 424px 268px #fff, 135px 152px #fff,
        168px 275px #fff, 990px 709px #fff, 227px 644px #fff, 312px 743px #fff, 209px 239px #fff,
        721px 215px #fff, 727px 479px #fff, 340px 905px #fff, 931px 389px #fff, 750px 427px #fff,
        349px 254px #fff, 255px 104px #fff, 150px 578px #fff, 513px 85px #fff, 231px 83px #fff,
        547px 251px #fff, 526px 998px #fff, 198px 24px #fff, 883px 2px #fff, 206px 47px #fff,
        399px 604px #fff, 988px 236px #fff, 618px 533px #fff, 235px 874px #fff, 869px 185px #fff,
        264px 317px #fff, 676px 152px #fff, 61px 137px #fff, 494px 524px #fff, 16px 794px #fff,
        74px 138px #fff, 963px 678px #fff, 520px 348px #fff, 282px 211px #fff, 92px 76px #fff,
        828px 328px #fff, 776px 5px #fff, 220px 389px #fff, 965px 823px #fff, 965px 423px #fff,
        918px 298px #fff, 189px 900px #fff, 373px 356px #fff, 817px 26px #fff, 536px 663px #fff,
        90px 648px #fff, 403px 707px #fff, 26px 83px #fff, 933px 540px #fff, 855px 225px #fff,
        914px 701px #fff, 291px 506px #fff, 622px 364px #fff, 722px 988px #fff, 90px 940px #fff,
        21px 549px #fff, 769px 54px #fff, 953px 601px #fff, 540px 947px #fff, 15px 976px #fff,
        950px 630px #fff, 219px 656px #fff, 376px 395px #fff, 727px 29px #fff, 401px 326px #fff,
        996px 850px #fff, 130px 849px #fff, 102px 794px #fff, 400px 960px #fff, 234px 372px #fff,
        3px 125px #fff, 729px 223px #fff, 418px 234px #fff, 444px 914px #fff, 629px 431px #fff,
        222px 250px #fff, 877px 11px #fff, 968px 25px #fff, 883px 410px #fff, 480px 683px #fff,
        337px 599px #fff, 378px 242px #fff, 588px 544px #fff, 901px 571px #fff, 822px 549px #fff,
        866px 178px #fff, 893px 951px #fff, 58px 525px #fff, 154px 417px #fff, 458px 389px #fff,
        123px 17px #fff, 245px 347px #fff, 336px 357px #fff, 859px 303px #fff, 27px 4px #fff,
        51px 275px #fff, 881px 228px #fff, 182px 367px #fff, 791px 721px #fff, 565px 239px #fff,
        226px 946px #fff, 20px 397px #fff, 91px 200px #fff, 915px 979px #fff, 463px 290px #fff,
        156px 399px #fff, 922px 496px #fff, 444px 567px #fff, 749px 685px #fff, 423px 218px #fff,
        905px 968px #fff, 950px 901px #fff, 902px 27px #fff, 559px 898px #fff, 623px 507px #fff,
        314px 702px #fff, 750px 307px #fff, 396px 320px #fff, 260px 386px #fff, 849px 328px #fff,
        591px 581px #fff, 918px 877px #fff, 428px 843px #fff, 742px 18px #fff, 804px 677px #fff,
        42px 312px #fff, 458px 7px #fff, 160px 537px #fff, 208px 372px #fff, 76px 919px #fff,
        33px 105px #fff, 352px 117px #fff, 806px 75px #fff, 641px 687px #fff, 545px 918px #fff,
        498px 569px #fff, 90px 739px #fff, 153px 925px #fff, 437px 145px #fff, 872px 240px #fff,
        119px 248px #fff, 726px 543px #fff, 733px 637px #fff, 46px 612px #fff, 6px 482px #fff,
        517px 481px #fff, 131px 262px #fff, 173px 801px #fff, 137px 565px #fff, 288px 972px #fff,
        363px 831px #fff, 399px 249px #fff, 453px 823px #fff, 638px 293px #fff, 425px 399px #fff,
        856px 836px #fff, 820px 716px #fff, 542px 584px #fff, 598px 935px #fff, 497px 698px #fff,
        123px 420px #fff, 699px 220px #fff, 4px 983px #fff, 480px 404px #fff, 563px 363px #fff,
        665px 106px #fff, 855px 911px #fff, 65px 703px #fff, 721px 666px #fff, 429px 881px #fff,
        484px 578px #fff, 464px 153px #fff, 393px 259px #fff, 282px 987px #fff, 201px 882px #fff,
        375px 481px #fff, 671px 489px #fff, 328px 302px #fff, 838px 725px #fff, 39px 979px #fff,
        740px 884px #fff, 58px 160px #fff, 590px 936px #fff, 685px 561px #fff, 591px 72px #fff,
        672px 896px #fff, 906px 567px #fff, 288px 305px #fff, 383px 310px #fff, 548px 832px #fff,
        23px 921px #fff, 858px 959px #fff, 837px 192px #fff, 825px 103px #fff, 874px 306px #fff,
        794px 909px #fff, 878px 841px #fff, 275px 548px #fff, 189px 730px #fff, 407px 389px #fff,
        761px 746px #fff, 454px 166px #fff, 515px 370px #fff, 520px 507px #fff, 657px 505px #fff,
        81px 815px #fff, 854px 814px #fff, 510px 497px #fff, 943px 845px #fff, 600px 542px #fff,
        241px 993px #fff, 391px 561px #fff, 873px 736px #fff, 454px 918px #fff, 569px 303px #fff,
        903px 755px #fff, 336px 884px #fff, 356px 524px #fff, 740px 276px #fff, 299px 59px #fff,
        87px 446px #fff, 291px 496px #fff, 110px 163px #fff, 258px 759px #fff, 594px 606px #fff,
        926px 259px #fff, 13px 92px #fff, 446px 177px #fff, 610px 227px #fff, 296px 536px #fff,
        465px 992px #fff, 328px 707px #fff, 567px 207px #fff, 73px 584px #fff, 182px 106px #fff,
        915px 271px #fff, 445px 370px #fff, 676px 6px #fff, 177px 895px #fff, 785px 631px #fff,
        391px 729px #fff, 670px 51px #fff, 521px 382px #fff, 140px 11px #fff, 168px 598px #fff,
        461px 215px #fff, 607px 155px #fff, 542px 755px #fff, 974px 794px #fff, 877px 994px #fff,
        969px 626px #fff, 930px 485px #fff, 474px 719px #fff, 126px 105px #fff, 219px 275px #fff,
        256px 727px #fff, 96px 919px #fff, 884px 459px #fff, 317px 390px #fff, 411px 74px #fff,
        670px 323px #fff, 340px 442px #fff, 377px 893px #fff, 779px 679px #fff, 12px 923px #fff,
        230px 850px #fff, 332px 327px #fff, 183px 81px #fff, 99px 750px #fff, 301px 194px #fff,
        778px 236px #fff, 712px 799px #fff, 242px 541px #fff, 308px 719px #fff, 993px 403px #fff,
        233px 647px #fff, 317px 690px #fff, 518px 368px #fff, 134px 944px #fff, 573px 510px #fff,
        893px 484px #fff, 481px 609px #fff, 916px 454px #fff, 125px 170px #fff, 125px 29px #fff,
        286px 411px #fff, 99px 831px #fff, 648px 175px #fff, 80px 678px #fff, 3px 638px #fff,
        215px 196px #fff, 757px 807px #fff, 290px 935px #fff, 86px 962px #fff, 185px 117px #fff,
        577px 313px #fff, 478px 617px #fff, 613px 386px #fff, 561px 604px #fff, 859px 57px #fff,
        636px 156px #fff, 914px 644px #fff, 495px 755px #fff, 646px 431px #fff, 65px 37px #fff,
        907px 645px #fff, 117px 633px #fff, 273px 78px #fff, 318px 890px #fff, 244px 820px #fff,
        586px 51px #fff, 919px 994px #fff, 775px 974px #fff, 666px 574px #fff, 977px 864px #fff,
        156px 203px #fff, 199px 7px #fff, 399px 884px #fff, 109px 346px #fff, 980px 633px #fff,
        29px 411px #fff, 885px 158px #fff, 479px 211px #fff, 688px 44px #fff, 130px 40px #fff,
        446px 249px #fff, 17px 143px #fff, 742px 436px #fff, 850px 709px #fff, 565px 410px #fff,
        378px 126px #fff, 309px 750px #fff, 899px 910px #fff, 485px 459px #fff, 975px 842px #fff,
        582px 896px #fff, 310px 916px #fff, 337px 537px #fff, 14px 818px #fff, 340px 226px #fff,
        740px 196px #fff, 89px 771px #fff, 701px 673px #fff, 710px 544px #fff, 62px 462px #fff,
        242px 263px #fff, 436px 54px #fff, 27px 583px #fff, 413px 25px #fff, 951px 795px #fff,
        735px 288px #fff, 766px 824px #fff, 395px 625px #fff, 969px 388px #fff, 303px 984px #fff,
        430px 829px #fff, 861px 828px #fff, 736px 575px #fff, 858px 585px #fff, 946px 758px #fff,
        503px 496px #fff, 573px 719px #fff, 456px 291px #fff, 794px 251px #fff, 533px 320px #fff,
        333px 978px #fff, 378px 306px #fff, 974px 695px #fff, 1000px 208px #fff, 456px 819px #fff,
        28px 104px #fff, 643px 23px #fff, 494px 475px #fff, 791px 790px #fff, 899px 786px #fff,
        6px 908px #fff, 549px 501px #fff, 455px 467px #fff, 401px 877px #fff, 2px 152px #fff,
        768px 971px #fff, 253px 929px #fff, 671px 119px #fff, 965px 139px #fff, 46px 965px #fff,
        441px 2px #fff, 476px 121px #fff, 210px 362px #fff, 552px 476px #fff, 521px 921px #fff,
        782px 502px #fff, 53px 454px #fff, 36px 552px #fff, 830px 790px #fff, 393px 74px #fff,
        234px 28px #fff, 298px 344px #fff, 267px 185px #fff, 672px 295px #fff, 106px 770px #fff,
        59px 897px #fff, 674px 920px #fff, 735px 823px #fff, 827px 367px #fff, 594px 307px #fff,
        847px 302px #fff, 832px 572px #fff, 972px 572px #fff, 826px 488px #fff, 744px 347px #fff,
        480px 820px #fff, 783px 781px #fff, 363px 309px #fff, 772px 967px #fff, 226px 934px #fff,
        563px 921px #fff, 612px 954px #fff, 259px 394px #fff, 751px 574px #fff, 137px 729px #fff,
        811px 858px #fff, 390px 498px #fff, 986px 765px #fff, 488px 508px #fff, 535px 592px #fff,
        777px 203px #fff, 72px 200px #fff, 782px 686px #fff, 338px 946px #fff, 795px 549px #fff,
        133px 655px #fff, 747px 279px #fff, 538px 446px #fff, 111px 912px #fff, 98px 134px #fff,
        191px 836px #fff, 307px 490px #fff, 690px 257px #fff, 965px 145px #fff, 448px 425px #fff,
        199px 264px #fff, 287px 265px #fff, 233px 563px #fff, 25px 178px #fff, 871px 970px #fff,
        330px 552px #fff, 550px 452px #fff, 305px 812px #fff, 282px 95px #fff, 89px 574px #fff,
        292px 993px #fff, 581px 462px #fff, 786px 579px #fff, 295px 546px #fff, 706px 740px #fff,
        139px 216px #fff, 856px 871px #fff, 611px 290px #fff, 555px 931px #fff, 461px 759px #fff,
        985px 463px #fff, 257px 970px #fff, 98px 674px #fff, 254px 334px #fff, 201px 620px #fff,
        312px 777px #fff, 245px 226px #fff, 44px 364px #fff, 425px 948px #fff, 218px 64px #fff,
        455px 210px #fff;
}

.stars-medium {
    width: 2px;
    height: 2px;
    background: transparent;
    box-shadow: 26px 934px #fff, 245px 19px #fff, 289px 667px #fff, 305px 497px #fff,
        858px 294px #fff, 982px 425px #fff, 416px 124px #fff, 993px 279px #fff, 746px 429px #fff,
        182px 285px #fff, 707px 446px #fff, 719px 546px #fff, 824px 837px #fff, 188px 968px #fff,
        527px 645px #fff, 951px 562px #fff, 931px 580px #fff, 217px 249px #fff, 466px 622px #fff,
        961px 264px #fff, 556px 813px #fff, 61px 626px #fff, 228px 722px #fff, 834px 121px #fff,
        856px 409px #fff, 542px 761px #fff, 21px 877px #fff, 13px 581px #fff, 300px 684px #fff,
        230px 64px #fff, 33px 102px #fff, 409px 1px #fff, 548px 610px #fff, 742px 720px #fff,
        155px 783px #fff, 653px 539px #fff, 428px 564px #fff, 679px 359px #fff, 407px 990px #fff,
        267px 54px #fff, 125px 338px #fff, 539px 218px #fff, 52px 19px #fff, 605px 177px #fff,
        582px 6px #fff, 971px 175px #fff, 898px 523px #fff, 698px 165px #fff, 624px 616px #fff,
        248px 556px #fff, 237px 725px #fff, 559px 402px #fff, 316px 853px #fff, 120px 859px #fff,
        240px 409px #fff, 853px 182px #fff, 121px 830px #fff, 468px 63px #fff, 585px 530px #fff,
        689px 676px #fff, 430px 681px #fff, 403px 359px #fff, 491px 927px #fff, 118px 853px #fff,
        585px 556px #fff, 435px 552px #fff, 726px 678px #fff, 448px 493px #fff, 561px 768px #fff,
        135px 924px #fff, 208px 411px #fff, 745px 991px #fff, 970px 537px #fff, 705px 110px #fff,
        500px 429px #fff, 434px 201px #fff, 58px 853px #fff, 711px 404px #fff, 190px 438px #fff,
        218px 273px #fff, 362px 49px #fff, 233px 375px #fff, 16px 70px #fff, 618px 10px #fff,
        194px 227px #fff, 674px 758px #fff, 644px 746px #fff, 222px 24px #fff, 5px 674px #fff,
        645px 754px #fff, 415px 552px #fff, 842px 811px #fff, 974px 660px #fff, 637px 20px #fff,
        977px 313px #fff, 888px 429px #fff, 833px 251px #fff, 932px 297px #fff, 801px 137px #fff,
        653px 614px #fff, 538px 780px #fff, 453px 368px #fff, 765px 806px #fff, 55px 858px #fff,
        158px 737px #fff, 617px 204px #fff, 94px 559px #fff, 35px 555px #fff, 117px 724px #fff,
        187px 626px #fff, 999px 728px #fff, 277px 16px #fff, 452px 316px #fff, 130px 865px #fff,
        112px 751px #fff, 841px 690px #fff, 50px 570px #fff, 813px 428px #fff, 296px 420px #fff,
        471px 659px #fff, 195px 719px #fff, 125px 654px #fff, 578px 908px #fff, 646px 509px #fff,
        553px 975px #fff, 558px 188px #fff, 274px 706px #fff, 362px 801px #fff, 421px 753px #fff,
        812px 207px #fff, 545px 450px #fff, 631px 134px #fff, 761px 518px #fff, 566px 257px #fff,
        458px 224px #fff, 417px 411px #fff, 660px 682px #fff, 94px 928px #fff, 480px 811px #fff,
        920px 491px #fff, 7px 495px #fff, 37px 21px #fff, 971px 620px #fff, 855px 391px #fff,
        8px 31px #fff, 543px 524px #fff, 308px 774px #fff, 322px 134px #fff, 903px 271px #fff,
        45px 389px #fff, 941px 281px #fff, 49px 466px #fff, 531px 580px #fff, 103px 210px #fff,
        916px 154px #fff, 862px 672px #fff, 90px 590px #fff, 459px 12px #fff, 525px 836px #fff,
        697px 455px #fff, 152px 780px #fff, 982px 514px #fff, 89px 703px #fff, 665px 405px #fff,
        527px 814px #fff, 720px 583px #fff, 894px 25px #fff, 740px 761px #fff, 282px 21px #fff,
        129px 381px #fff, 989px 951px #fff, 960px 155px #fff, 327px 896px #fff, 814px 433px #fff,
        787px 956px #fff, 931px 857px #fff, 582px 904px #fff, 603px 730px #fff, 438px 186px #fff,
        371px 385px #fff, 69px 829px #fff, 38px 978px #fff, 821px 711px #fff, 728px 3px #fff,
        192px 638px #fff, 67px 247px #fff, 819px 414px #fff, 214px 410px #fff, 102px 38px #fff,
        103px 12px #fff, 518px 135px #fff, 741px 697px #fff, 741px 676px #fff, 426px 651px #fff,
        687px 595px #fff, 113px 504px #fff, 695px 476px #fff, 275px 119px #fff, 459px 233px #fff,
        705px 907px #fff;
    animation: twinkling 2s ease-in-out infinite;
}
.stars-medium::after {
    content: ' ';
    position: absolute;
    top: 100px;
    width: 2px;
    height: 2px;
    background: transparent;
    box-shadow: 26px 934px #fff, 245px 19px #fff, 289px 667px #fff, 305px 497px #fff,
        858px 294px #fff, 982px 425px #fff, 416px 124px #fff, 993px 279px #fff, 746px 429px #fff,
        182px 285px #fff, 707px 446px #fff, 719px 546px #fff, 824px 837px #fff, 188px 968px #fff,
        527px 645px #fff, 951px 562px #fff, 931px 580px #fff, 217px 249px #fff, 466px 622px #fff,
        961px 264px #fff, 556px 813px #fff, 61px 626px #fff, 228px 722px #fff, 834px 121px #fff,
        856px 409px #fff, 542px 761px #fff, 21px 877px #fff, 13px 581px #fff, 300px 684px #fff,
        230px 64px #fff, 33px 102px #fff, 409px 1px #fff, 548px 610px #fff, 742px 720px #fff,
        155px 783px #fff, 653px 539px #fff, 428px 564px #fff, 679px 359px #fff, 407px 990px #fff,
        267px 54px #fff, 125px 338px #fff, 539px 218px #fff, 52px 19px #fff, 605px 177px #fff,
        582px 6px #fff, 971px 175px #fff, 898px 523px #fff, 698px 165px #fff, 624px 616px #fff,
        248px 556px #fff, 237px 725px #fff, 559px 402px #fff, 316px 853px #fff, 120px 859px #fff,
        240px 409px #fff, 853px 182px #fff, 121px 830px #fff, 468px 63px #fff, 585px 530px #fff,
        689px 676px #fff, 430px 681px #fff, 403px 359px #fff, 491px 927px #fff, 118px 853px #fff,
        585px 556px #fff, 435px 552px #fff, 726px 678px #fff, 448px 493px #fff, 561px 768px #fff,
        135px 924px #fff, 208px 411px #fff, 745px 991px #fff, 970px 537px #fff, 705px 110px #fff,
        500px 429px #fff, 434px 201px #fff, 58px 853px #fff, 711px 404px #fff, 190px 438px #fff,
        218px 273px #fff, 362px 49px #fff, 233px 375px #fff, 16px 70px #fff, 618px 10px #fff,
        194px 227px #fff, 674px 758px #fff, 644px 746px #fff, 222px 24px #fff, 5px 674px #fff,
        645px 754px #fff, 415px 552px #fff, 842px 811px #fff, 974px 660px #fff, 637px 20px #fff,
        977px 313px #fff, 888px 429px #fff, 833px 251px #fff, 932px 297px #fff, 801px 137px #fff,
        653px 614px #fff, 538px 780px #fff, 453px 368px #fff, 765px 806px #fff, 55px 858px #fff,
        158px 737px #fff, 617px 204px #fff, 94px 559px #fff, 35px 555px #fff, 117px 724px #fff,
        187px 626px #fff, 999px 728px #fff, 277px 16px #fff, 452px 316px #fff, 130px 865px #fff,
        112px 751px #fff, 841px 690px #fff, 50px 570px #fff, 813px 428px #fff, 296px 420px #fff,
        471px 659px #fff, 195px 719px #fff, 125px 654px #fff, 578px 908px #fff, 646px 509px #fff,
        553px 975px #fff, 558px 188px #fff, 274px 706px #fff, 362px 801px #fff, 421px 753px #fff,
        812px 207px #fff, 545px 450px #fff, 631px 134px #fff, 761px 518px #fff, 566px 257px #fff,
        458px 224px #fff, 417px 411px #fff, 660px 682px #fff, 94px 928px #fff, 480px 811px #fff,
        920px 491px #fff, 7px 495px #fff, 37px 21px #fff, 971px 620px #fff, 855px 391px #fff,
        8px 31px #fff, 543px 524px #fff, 308px 774px #fff, 322px 134px #fff, 903px 271px #fff,
        45px 389px #fff, 941px 281px #fff, 49px 466px #fff, 531px 580px #fff, 103px 210px #fff,
        916px 154px #fff, 862px 672px #fff, 90px 590px #fff, 459px 12px #fff, 525px 836px #fff,
        697px 455px #fff, 152px 780px #fff, 982px 514px #fff, 89px 703px #fff, 665px 405px #fff,
        527px 814px #fff, 720px 583px #fff, 894px 25px #fff, 740px 761px #fff, 282px 21px #fff,
        129px 381px #fff, 989px 951px #fff, 960px 155px #fff, 327px 896px #fff, 814px 433px #fff,
        787px 956px #fff, 931px 857px #fff, 582px 904px #fff, 603px 730px #fff, 438px 186px #fff,
        371px 385px #fff, 69px 829px #fff, 38px 978px #fff, 821px 711px #fff, 728px 3px #fff,
        192px 638px #fff, 67px 247px #fff, 819px 414px #fff, 214px 410px #fff, 102px 38px #fff,
        103px 12px #fff, 518px 135px #fff, 741px 697px #fff, 741px 676px #fff, 426px 651px #fff,
        687px 595px #fff, 113px 504px #fff, 695px 476px #fff, 275px 119px #fff, 459px 233px #fff,
        705px 907px #fff;
}

.stars-large {
    width: 3px;
    height: 3px;
    background: transparent;
    box-shadow: 231px 361px #fff, 159px 816px #fff, 171px 58px #fff, 567px 607px #fff,
        674px 658px #fff, 289px 308px #fff, 260px 320px #fff, 772px 489px #fff, 150px 998px #fff,
        365px 817px #fff, 622px 819px #fff, 716px 806px #fff, 184px 356px #fff, 468px 844px #fff,
        675px 162px #fff, 136px 984px #fff, 295px 688px #fff, 949px 589px #fff, 47px 203px #fff,
        837px 81px #fff, 661px 393px #fff, 915px 533px #fff, 387px 427px #fff, 627px 100px #fff,
        720px 278px #fff, 653px 665px #fff, 103px 778px #fff, 638px 569px #fff, 874px 676px #fff,
        813px 225px #fff, 156px 635px #fff, 32px 782px #fff, 418px 922px #fff, 968px 620px #fff,
        746px 656px #fff, 7px 814px #fff, 640px 238px #fff, 758px 185px #fff, 20px 360px #fff,
        563px 99px #fff, 1px 318px #fff, 192px 873px #fff, 881px 229px #fff, 627px 105px #fff,
        547px 747px #fff, 94px 233px #fff, 639px 984px #fff, 873px 539px #fff, 89px 866px #fff,
        174px 553px #fff, 138px 2px #fff, 37px 104px #fff, 816px 123px #fff, 954px 663px #fff,
        287px 193px #fff, 637px 887px #fff, 275px 82px #fff, 598px 856px #fff, 561px 125px #fff,
        816px 617px #fff, 215px 266px #fff, 618px 61px #fff, 125px 997px #fff, 2px 385px #fff,
        725px 9px #fff, 234px 233px #fff, 769px 15px #fff, 679px 466px #fff, 946px 949px #fff,
        457px 101px #fff, 386px 254px #fff, 907px 854px #fff, 688px 278px #fff, 661px 135px #fff,
        548px 43px #fff, 949px 216px #fff, 557px 221px #fff, 94px 371px #fff, 764px 684px #fff,
        9px 555px #fff, 546px 687px #fff, 157px 419px #fff, 411px 382px #fff, 689px 100px #fff,
        558px 238px #fff, 945px 82px #fff, 623px 173px #fff, 818px 261px #fff, 888px 335px #fff,
        47px 196px #fff, 986px 235px #fff, 115px 739px #fff, 293px 551px #fff, 983px 571px #fff,
        110px 290px #fff, 961px 870px #fff, 529px 10px #fff, 229px 626px #fff, 570px 659px #fff,
        124px 103px #fff;
    animation: twinkling 3s ease-in-out infinite;
}
.stars-large::after {
    content: ' ';
    position: absolute;
    top: 100px;
    width: 2px;
    height: 2px;
    background: transparent;
    box-shadow: 231px 361px #fff, 159px 816px #fff, 171px 58px #fff, 567px 607px #fff,
        674px 658px #fff, 289px 308px #fff, 260px 320px #fff, 772px 489px #fff, 150px 998px #fff,
        365px 817px #fff, 622px 819px #fff, 716px 806px #fff, 184px 356px #fff, 468px 844px #fff,
        675px 162px #fff, 136px 984px #fff, 295px 688px #fff, 949px 589px #fff, 47px 203px #fff,
        837px 81px #fff, 661px 393px #fff, 915px 533px #fff, 387px 427px #fff, 627px 100px #fff,
        720px 278px #fff, 653px 665px #fff, 103px 778px #fff, 638px 569px #fff, 874px 676px #fff,
        813px 225px #fff, 156px 635px #fff, 32px 782px #fff, 418px 922px #fff, 968px 620px #fff,
        746px 656px #fff, 7px 814px #fff, 640px 238px #fff, 758px 185px #fff, 20px 360px #fff,
        563px 99px #fff, 1px 318px #fff, 192px 873px #fff, 881px 229px #fff, 627px 105px #fff,
        547px 747px #fff, 94px 233px #fff, 639px 984px #fff, 873px 539px #fff, 89px 866px #fff,
        174px 553px #fff, 138px 2px #fff, 37px 104px #fff, 816px 123px #fff, 954px 663px #fff,
        287px 193px #fff, 637px 887px #fff, 275px 82px #fff, 598px 856px #fff, 561px 125px #fff,
        816px 617px #fff, 215px 266px #fff, 618px 61px #fff, 125px 997px #fff, 2px 385px #fff,
        725px 9px #fff, 234px 233px #fff, 769px 15px #fff, 679px 466px #fff, 946px 949px #fff,
        457px 101px #fff, 386px 254px #fff, 907px 854px #fff, 688px 278px #fff, 661px 135px #fff,
        548px 43px #fff, 949px 216px #fff, 557px 221px #fff, 94px 371px #fff, 764px 684px #fff,
        9px 555px #fff, 546px 687px #fff, 157px 419px #fff, 411px 382px #fff, 689px 100px #fff,
        558px 238px #fff, 945px 82px #fff, 623px 173px #fff, 818px 261px #fff, 888px 335px #fff,
        47px 196px #fff, 986px 235px #fff, 115px 739px #fff, 293px 551px #fff, 983px 571px #fff,
        110px 290px #fff, 961px 870px #fff, 529px 10px #fff, 229px 626px #fff, 570px 659px #fff,
        124px 103px #fff;
}

.pyramids {
    position: absolute;
    bottom: 100px;
    left: 80px;
    z-index: 1;
}

.pyramid {
    position: absolute;
    width: 300px;
    height: 100px;
    background: linear-gradient(225deg, #0b385f, #000c16);
    clip-path: polygon(50% 0%, 10% 100%, 100% 100%);
}

.pyramid-menkaure {
    transform: translate(-80px, 10px) scale(0.8);
}

.pyramid-giza {
    transform: translate(90px, 20px) scale(0.75);
}

@keyframes sky-timelapse {
    from {
        transform: rotate(0deg);
    }
    to {
        transform: rotate(360deg);
    }
}
@keyframes twinkling {
    from {
        opacity: 0.5;
    }
    50% {
        opacity: 1;
    }
    to {
        opacity: 0.5;
    }
}
.shooting-star {
    position: relative;
    top: 100px;
    width: 4px;
    height: 4px;
    border-radius: 50%;
    background-color: #ffffff;
    transform: translate(150px, -150px);
    animation: shooting 1s ease-out forwards;
}
.shooting-star::after {
    content: '';
    position: absolute;
    top: 0;
    left: 2px;
    border: 2px solid #f00;
    border-width: 2px 150px 2px 150px;
    border-color: transparent transparent transparent #ffffff;
    transform: rotate(-45deg);
    transform-origin: 0% 100%;
}

.shooting-star-1 {
    left: 200px;
		animation-delay: 4s;
	  animation-duration: 4s;
	  animation-iteration-count: infinite;
	
	
}

.shooting-star-2 {
    left: 480px;
    animation-delay: 6s;
	
	animation-duration: 6s;
	animation-iteration-count: infinite;
	
}

.shooting-star-3 {
    left: 400px;
    animation-delay: 0s;
	
	animation-duration: 4s;
	animation-iteration-count: infinite;
	
}

.shooting-star-4 {
    left: 200px;
    animation-delay: 10s;
	
	animation-duration: 10s;
	animation-iteration-count: infinite;
	
}

.shooting-star-5 {
    left: 480px;
    animation-delay: 14s;
	
	animation-duration: 14s;
	animation-iteration-count: infinite;
	animation-direction: alternate;
}


@keyframes shooting {
    0% {
        opacity: 0;
        transform: scale(0) translate(0, 0);
    }
    50% {
        opacity: 1;
        transform: scale(1) translate(-250px, 250px);
    }
    100% {
        opacity: 0;
        transform: scale(1) translate(-300px, 300px);
    }
}
	
	
	
</style>